@extends('layouts.sell')
@section('title','卖出')
@section('content')
<style>
    .default-posi{
        width: 3.75rem;
        height: 100%;
        background: rgba(0,0,0,.6);
        position: fixed;
        z-index: 100;
        display: none;
        left: 0;
        top: 0;
    }
    .alert-d{
        width: 1.5rem;
        height: .74rem;
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        background: #FFFFFF;
        padding:.03rem .10rem;
        border-radius: .05rem;
    }
    .alert-d p:nth-of-type(1){
        font-size: .12rem;
        line-height: .24rem;
        text-align: left;
        color: #333333;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .cancel-alert{
        width: .12rem;
        height: .12rem;
        background: url("../images/quxiao2x.png") 0 0 no-repeat;
        background-size: .12rem;
    }
    .content-text{
        color: #333333;
        font-size: .12rem;
        line-height: .30rem;
        height: .50rem;
        box-sizing: border-box;
        border-top: 1px solid #999;
    }
    .alert-d p:nth-of-type(3){
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }
</style>
<div class="container">
	<!--顶部返回按钮-->
	<div class="back-previous-page clear">
		<div class="back-button left">
			<img src="{{ config('app.url') }}/sale/images/back.png" alt="">
		</div>
		<div class="back-title left">
			<span>卖出</span>
		</div>
	</div>
	<div class="default-kong"></div>
	<!--购买数据-->
	<div class="user-buy-data">
		<ul>
			<li>
				<p>
					<span class="user">用户名</span>
					<span class="user-data user-data-sell"></span>
				</p>
			</li>
			<li>
				<p>
					<span>持有数量</span>
					<span class="shengyu-data shengyu-data-sell"></span>
				</p>
			</li>
			<li>
				<div class="sell-d">
					<div class="sell-d-l">卖出价格</div>
					<div class="sell-d-r">
						<input type="number" class="buy-price-data buy-price-data-sell" value="0">
						<span class="right-span-bg right-span-bg-sell"></span>
					</div>
				</div>
			</li>
			<li>
				<p>
					<span>卖出数量</span>
					<span class="add-or-reduce">
                        <a href="javascript:void(0)" class="reduce-data reduce-data-sell"></a>
                        <input class="buy-number buy-number-sell" value="0">
                        <a href="javascript:void(0)" class="add-data add-data-sell"></a>
                    </span>
				</p>
			</li>
			<li>
				<p>
					<span>总计收入</span>
					<span class="computed-pay">
                        <span class="pay-data pay-data-sell"></span>
                        <span class="pay-unit">元</span>
                    </span>
				</p>
			</li>
		</ul>
	</div>
	<!--提示信息-->
	<div class="prompt-msg">
		<p class="p-title">提示信息</p>
		<p class="prompt">
			<span class="prompt-num">1.</span>
			<span class="prompt-content">挂卖信息直到目标卖出数量卖完为止。</span>
		</p>
		<p class="prompt">
			<span class="prompt-num">2.</span>
			<span class="prompt-content">发布后若无交易记录可撤单，若已进行交易直到目标卖出数量销完为止，中途不可撤单。</span>
		</p>
		<p class="prompt">
			<span class="prompt-num">3.</span>
			<span class="prompt-content">每笔交易都会经过系统处理，请谨慎下单，下单完成后可在交易记录查看交易情况。</span>
		</p>
		<p class="need-buy-p">
			<!--点击此处按钮进行接口调用-->
			<a class="need-buy need-buy-sell" href="javascript:void(0)">我要卖出</a>
		</p>
	</div>
</div>
<div class="posi-block">

	<div class="input-pass">
		<p>支付密码</p>
		<ul>
			<li><div><img src="{{ config('app.url') }}/sale/images/block-dian.png" alt=""></div></li>
			<li><div><img src="{{ config('app.url') }}/sale/images/block-dian.png" alt=""></div></li>
			<li><div><img src="{{ config('app.url') }}/sale/images/block-dian.png" alt=""></div></li>
			<li><div><img src="{{ config('app.url') }}/sale/images/block-dian.png" alt=""></div></li>
			<li><div><img src="{{ config('app.url') }}/sale/images/block-dian.png" alt=""></div></li>
			<li><div><img src="{{ config('app.url') }}/sale/images/block-dian.png" alt=""></div></li>
		</ul>
		<input type="number" class="password" id="password" autocomplete="off">
		<div class="pay-cancel">
			<span>确认</span>
			<span>取消</span>
		</div>
	</div>
</div>
<div class="default-posi">
    <div class="alert-d">
        <p>
            <span>信息</span>
            <span class="cancel-alert"></span>
        </p>
        <p class="content-text"></p>

    </div>
</div>
@endsection

